<template>
  <el-table :data="prizeData" style="width: 100%" :max-height="height" border @selection-change="selectChange" ref="prizeList" class="check-prize-list">
    <el-table-column type="selection" width="55" v-if="select">
    </el-table-column>
    <el-table-column prop="id" label="奖品id" align='center'>
    </el-table-column>
    <el-table-column prop="name" label="奖品名称" align='center'>
    </el-table-column>
    <el-table-column label="奖品类型" align='center' width="250">
      <template slot-scope="scope">
        <span v-text="prizeTypeName[scope.row.prizeType]||{1:'实物',2:'虚拟'}[scope.row.type]"></span>
      </template>
    </el-table-column>
  </el-table>
</template>
<script>
export default {
	props: {
		prizeData: {
			type: Array,
			default() {
				return [];
			},
		},
		select: {
			type: Boolean,
			default: false,
		},
		height: {
			type: Number,
			default: 250,
		},
		checkPrize: {
			type: Array,
			default() {
				return [];
			},
		},
	},
	data() {
		return {
			prizeTypeName: {
				21: '现金',
				22: '体验金',
				1: '加息劵',
				2: '折扣卷',
				4: '火箭卷',
				5: '提现劵',
			},
		};
	},
	mounted() {
		this.signSelect();
		// console.log('创建了')
	},
	methods: {
		signSelect() {
			let rows = this.checkPrize;
			// this.$refs.multipleTable.toggleRowSelection(this.tableData[1],true);
			if (rows) {
				rows.forEach(row => {
					let i = this._gitIndex(row);
					// console.log('----xxxxxx---',i,this.selectData )
					i !== null ? this.$refs.prizeList.toggleRowSelection(this.prizeData[i]) : '';
				});
			} else {
				this.$refs.prizeList.clearSelection();
			}
		},
		_gitIndex(row) {
			let i = null;
			this.prizeData.some((item, index) => {
				if (item.id == row.id) {
					i = index;
					return true;
				}
			});
			return i;
		},
		selectChange(rows) {
			this.$emit('selectChange', rows);
			// console.log('%c gc_row=>: ','color: MidnightBlue; background: Aquamarine; font-size: 20px;',rows);
		},
		// getGoudsType(type){

		// }
	},
};
</script>
style.<style lang="scss">
.check-prize-list{
	.el-table__body, .el-table__footer, .el-table__header{
		table-layout: auto;
	}
}
</style>


